<template>
	<view>
		<view class="content">
			<view class="list">
				<view class="row">
					<view class="title">头像</view>
					<view class="right"  @click="userimg"><view class="tis">
					<u-avatar :src="src"  size="50"></u-avatar>
					<!-- <image src="/static/img/face.jpg" mode="widthFix"></image> -->
					</view><view class="icon xiangyou"></view></view>
				</view>
				<view class="row">
					<view class="title">昵称</view>
					<view class="right"><view class="tis">{{userinfo.nickname}}</view>
					<view class="icon xiangyou"></view>
					</view>
				</view>
				<!-- <view class="row">
					<view class="title">个性签名</view>
					<view class="right"><view class="tis">这人太懒了，什么都不写</view><view class="icon xiangyou"></view></view>
				</view> -->
				<view class="row" @click="$u.route('/pages/user/address/address')">
					<view class="title">收货地址</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
				<view class="row" @click="$u.route('/pages/user/setting/edit')">
					<view class="title">支付信息</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
				<!-- <view class="row">
					<view class="title">账户安全</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view> -->
			</view>
			<!-- <view class="list">
				<view class="row">
					<view class="title">通知提醒</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
				
				<view class="row">
					<view class="title">通用</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
			</view> -->
			<view class="list">
				<!-- #ifdef APP-PLUS -->
				<view class="row">
					<view class="title">版本升级</view>
					<view class="right"><view class="tis">{{version}}</view><view class="icon xiangyou"></view></view>
				</view>
				<!-- #endif -->
				
				<!-- <view class="row">
					<view class="title">清除缓存</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
				<view class="row">
					<view class="title">问题反馈</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
				<view class="row">
					<view class="title">关于商城</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view> -->
				<view class="row" @tap="logOut">
					<view class="title">退出登录</view>
					<view class="right"><view class="tis"></view><view class="icon xiangyou"></view></view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import service from '@/service.js';
	export default {
		data() {
			return {
				userinfo:{},
				src:'',
				img:'',
				version:'',
				versionCode:''
			};
		},
		onLoad(){
			this.userinfo=uni.getStorageSync("USERS_KEY");
			this.src = this.imgurl+this.userinfo.img;
			plus.runtime.getProperty(plus.runtime.appid, (info) => {
				console.log(JSON.stringify(info));
				this.version = info.version;
				this.versionCode = info.versionCode;
			})
		},
		methods: {
			showType(tbIndex){
				this.tabbarIndex = tbIndex;
				this.list = this.orderList[tbIndex];
			},
			async userimg(){
				console.log('头像');
				uni.showLoading({
					title: '上传中'
				});
				uni.chooseImage({
					count:1,
					crop:{
						width:300,
						height:300
					},
					success: res => {
						if(res.tempFiles[0].size>512000){
							this.$api.msg('头像图片不得大于1mb');
							return ;
						}
						uni.uploadFile({
							url: this.apiurl +'upload/index.html', //仅为示例，非真实的接口地址
							filePath: res.tempFilePaths[0],
							name: 'file',
							header:{
								token:uni.getStorageSync('token')
							},
							success: (uploadFileRes) => {
								console.log(uploadFileRes.data);
								var result = JSON.parse(uploadFileRes.data);
								if(result.code == -1){
									this.$api.msg(result.msg);
								}else{
									console.log(result.data);
									
									this.src = this.imgurl+result.data;
									this.img = result.data;
									this.userimg1(result.data);
								}
								
							}
						});
					}
				});
				uni.hideLoading();
			},
			async userimg1(res){
				var result = (await this.$ajax.get('Users/setuserimg.html?img=' + res));
				if(result.data.code == 1){
					this.userinfo['img'] = res;
					uni.setStorageSync('USERS_KEY', this.userinfo);
				}
				// this.userinfo=uni.getStorageSync("USERS_KEY");
			},
			logOut(){
				service.logOut();
				uni.reLaunch({
					url:'/pages/login/login'
				})
			},
			loginout(){
				if(!this.islogin){
					this.$api.msg('您还未登录，请先登录');
					return;
				}
				uni.showModal({
					title:'确认',
					content:'是否确认退出账号',
					success: (res) => {
							console.log(res);
							if(res.confirm){
								uni.clearStorageSync();
								this.$api.msg('退出登录');
								setTimeout(function(){
									uni.$u.route('/pages/login/login');
								},1000)
								// this.$navTo('/pages/user/user');
							}else{
								this.$api.msg('取消退出');
							}
					}
				})
				
			}
		}
	}
</script>

<style lang="scss">
page{
	background-color: #f3f3f3;	
}

.icon {
	font-size: 30upx;

}
.content{
	padding-bottom: 20upx;
	.list{
		width: 96%;
		padding-left: 4%;
		background-color: #fff;
		margin-bottom: 20upx;
		.row{
			widows: 100%;
			min-height: 90upx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			border-bottom: solid 1upx #eee;
			&:last-child{
				border-bottom: none;
			}
			.title{
				font-size: 32upx;
				color: #333;
			}
			.right{
				display: flex;
				align-items: center;
				color: #999;
				.tis{
					font-size: 26upx;
					margin-right: 5upx;
					max-height: 120upx;
					image{
						width: 100upx;
						height: 100upx;
						border-radius: 100%;
						margin: 10upx 0;
					}
				}
				.icon{
					width: 40upx;
					color: #cecece;
				}
			}
			
		}
	}
}

</style>
